<template>
    <div class="lead">
        <van-nav-bar :title="$t('ecology_node.get_main')" leftArrow @click-left="_return"/>
        <div class="leadMain login">
            <van-cell :title="$t('common.coin')" value="AAT"></van-cell>
            <van-cell :title="$t('common.amount')" value="1,000,000"></van-cell>
            <van-field :label="$t('ecology_node.ip')" v-model="nodeip" placeholder="0.0.0.0" input-align="right"></van-field>
            <button class="btn" @click="submite">{{$t('ecology_node.button_six')}}</button>
        </div>
        <van-popup v-model="pwdShow" position="bottom" :overlay="true">
            <van-nav-bar :title="$t('pay.title')" leftArrow @click-left="pwdShow = false"/>
            <div class="pwdMain login">
                <van-cell-group>
                    <van-field v-model="payPassword" :placeholder="$t('pay.title')" input-align="center" type="password" maxlength="6"/>
                </van-cell-group>
                <p @click='forgetPwd'>{{$t('common.forget_password')}}？</p>
                <div class="btns">
                    <van-button type="info" @click="submitMove">{{$t('pay.button')}}</van-button>
                </div>
            </div>
        </van-popup>
        <loading v-if="loadingShow"></loading>
    </div>
</template>

<script>
    export default {
        data() {
            return {
                pwdShow:false,
                payPassword:'',
                nodeip:'',
                loadingShow:false
            }
        },
        methods: {
            _return(){
                this.$emit('_return')
            },
            forgetPwd(){
                this.$router.push({name:'safe',params:{mine:this.$route.path}})
            },
            submitMove(){
                if(!this.payPassword){
                    this.$toast(this.$t('pay.title'))
                    return
                }
                this.loadingShow = true
                this.$api.post('resonate/mainnode',{paypassword:this.payPassword,nodeip:this.nodeip})
                    .then(res =>{
                        this.loadingShow = false
                        this.$toast(res.message)
                        this._return()
                    })
            },
            submite(){
                if(!this.nodeip){
                    this.$toast(this.$t('info.press'))
                    return
                }
                this.pwdShow = true
            }
        },
        created() {

        },
        mounted() {

        },
    }
</script>

<style lang="stylus" scoped>
    bac = linear-gradient(90deg,rgba(42,42,42,1) 0%,rgba(46,46,46,1) 100%)!important
    back = linear-gradient(90deg,rgba(203,175,137,1) 0%,rgba(219,200,170,1) 100%) !important
    font = #CBAF89
    fonts = #898989
    [class*=van-hairline]::after{
        border: none;
    }
    .van-cell:not(:last-child)::after
        border none
    .leadMain
        width 94%
        margin 0 auto
        .van-cell
            background bac
            color #D8D8D8
            padding 25px 10px
            margin-bottom 5px
            border-radius 5px
            .van-cell__value
                color font
        .btn
            color #000
    .van-popup
        background: #160d01
        .van-nav-bar
            background: #160d01 !important;
        .van-picker
            background: #160d01 !important;
            color: #fff;
    .pwdMain{
        width: 96%;
        margin: 0 auto;
        .van-cell-group{
            border-top: 1px solid #ebedf0;
            border-bottom: 1px solid #ebedf0;
        }
        p{
            text-align: center;
            color: #FDDEB0;
            font-size: 12px;
            margin-top: 10px;
        }
        .van-cell{
            background: #403930 !important;
            color: #E6E6E6;
            .van-cell__value{
                color: #FDDEB0;
            }
        }
        .btns{
            display: flex;
            display: -webkit-flex;
            justify-content: center;
            margin-top: 170px;
            padding-bottom 15px
            .van-button{
                width: 100%;
                color: #000;
                background:linear-gradient(90deg,rgba(192,145,81,1) 0%,rgba(230,200,150,1) 100%);
                border: none;
                /*margin-left: 5%;*/
            }
        }
    }


</style>